{% extends 'base.html' %}
{% load static %}

{% block title %}Мои бронирования - МОЙ НЕ САМ{% endblock %}

{% block content %}
<div class="container">
    <h1 class="mb-4">Мои бронирования</h1>
    
    <div class="mb-3">
        <a href="{% url 'tables_catalog' %}" class="btn btn-primary">
            <i class="bi bi-plus-lg"></i> Забронировать стол
        </a>
    </div>
    
    {% if messages %}
    <div class="messages mb-4">
        {% for message in messages %}
        <div class="alert alert-{{ message.tags }}">
            {{ message }}
        </div>
        {% endfor %}
    </div>
    {% endif %}
    
    <div class="card">
        <div class="card-header bg-primary text-white">
            <h5 class="mb-0">История бронирований</h5>
        </div>
        <div class="card-body">
            {% if reservations %}
            <div class="table-responsive">
                <table class="table table-hover align-middle">
                    <thead>
                        <tr>
                            <th>№</th>
                            <th>Стол</th>
                            <th>Дата и время</th>
                            <th>Гости</th>
                            <th>Статус</th>
                            <th>Действия</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for reservation in reservations %}
                        <tr>
                            <td>#{{ reservation.id }}</td>
                            <td>
                                <a href="{% url 'table_detail' reservation.table.id %}">
                                    Стол #{{ reservation.table.number }}
                                </a><br>
                                <small class="text-muted">{{ reservation.table.get_location_display }}</small>
                            </td>
                            <td>
                                {{ reservation.start_time|date:"d.m.Y" }}<br>
                                <small class="text-muted">
                                    {{ reservation.start_time|date:"H:i" }} - {{ reservation.end_time|date:"H:i" }}
                                </small>
                            </td>
                            <td>{{ reservation.guests_count }} чел.</td>
                            <td>
                                {% if reservation.status == 'pending' %}
                                <span class="badge bg-warning text-dark">Ожидает подтверждения</span>
                                {% elif reservation.status == 'confirmed' %}
                                <span class="badge bg-success">Подтверждено</span>
                                {% elif reservation.status == 'completed' %}
                                <span class="badge bg-info">Завершено</span>
                                {% elif reservation.status == 'cancelled' %}
                                <span class="badge bg-danger">Отменено</span>
                                {% endif %}
                            </td>
                            <td>
                                {% if reservation.status == 'pending' or reservation.status == 'confirmed' %}
                                <a href="{% url 'cancel_reservation' reservation.id %}" class="btn btn-sm btn-outline-danger">
                                    Отменить
                                </a>
                                {% endif %}
                            </td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
            {% else %}
            <div class="alert alert-info">
                <p class="mb-0">У вас пока нет бронирований. <a href="{% url 'tables_catalog' %}">Забронировать стол</a>.</p>
            </div>
            {% endif %}
        </div>
    </div>
</div>
{% endblock %}